// src/styles/variables.scss

// ============ 移动端变量 ============
$mobile-max-width: 750px;
$mobile-primary-color: #1890ff;
$mobile-text-color: #333;
$mobile-bg-color: #fff;

// 移动端间距系统 (基于750设计稿)
$mobile-spacing: (
  xs: 8px,
  sm: 12px,
  md: 16px,
  lg: 24px,
  xl: 32px,
);

// 移动端字体大小
$mobile-font-sizes: (
  xs: 20px,
  sm: 24px,
  base: 28px,
  lg: 32px,
  xl: 36px,
  xxl: 40px,
);

// ============ PC端变量 ============
$pc-max-width: 1440px;
$pc-primary-color: #1890ff;
$pc-text-color: #333;
$pc-bg-color: #f5f5f5;

// PC端间距系统 (基于1440设计稿)
$pc-spacing: (
  xs: 4px,
  sm: 8px,
  md: 12px,
  lg: 16px,
  xl: 24px,
  xxl: 32px,
);

// PC端字体大小
$pc-font-sizes: (
  xs: 12px,
  sm: 14px,
  base: 16px,
  lg: 18px,
  xl: 20px,
  xxl: 24px,
);

// ============ 通用变量 ============
$border-radius: (
  sm: 4px,
  md: 8px,
  lg: 12px,
  round: 50%,
);

$z-index: (
  dropdown: 1000,
  modal: 1050,
  popover: 1060,
  tooltip: 1070,
);

// 阴影
$box-shadow: (
  sm: 0 2px 4px rgba(0, 0, 0, 0.1),
  md: 0 4px 8px rgba(0, 0, 0, 0.12),
  lg: 0 8px 16px rgba(0, 0, 0, 0.15),
);

// 过渡动画
$transition-duration: (
  fast: 0.15s,
  base: 0.3s,
  slow: 0.5s,
);

